import React from "react";
import {message,Spin} from 'antd';
import Relay from "react-relay";
import Logic_Table from './Logic_Table';
import Logic_Chart from './Logic_Chart';
import Util from "../../../../util/Util"

import ProductionScheduleServerMutation from '../../mutation/productionScheduling/ProductionScheduleServerMutation';

export default class A extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            tableData:null,
            chartData:null,
            data:null,
            canvasWidth:null,
            dateArr:null,
            delayDays:"0",
            d_start:"",
            d_end:"",
            spinning: true,
        };
        this.MAX_TOTAL_COUNT = "";
        this.planAverageCount = "";
    }

    componentDidMount(){
        //
    }

    componentWillReceiveProps(nextProps){
        if(nextProps){
            const psId = nextProps.psId;
            //更新psId  httpRequest
            psId && this.httpRequest({
                action : "desc",
                psId:psId
            },this.TableDataFormatting);
        }
    }

    httpRequest(inParam,cb){
        Relay.Store.commitUpdate(
            new ProductionScheduleServerMutation({...inParam}),
            {
                onFailure: () => {
                    message.error('网络请求失败');
                    this.setState({
                        spinning:false,
                    })
                },
                onSuccess: (response) => {
                    let errorCode = response.productionScheduleServer.responseData.errorCode;
                    let value = response.productionScheduleServer.responseData.value;
                    if(errorCode == 0){
                        switch (inParam.action){
                            case "desc"://表格数据
                                let data = response.productionScheduleServer.responseData.productionScheduleModel;

                                /**
                                 * 表格假数据
                                 * data = {
                                    psId:"8",
                                    orderId:"123",
                                    styleNo:"123",
                                    startDate:1492417647000,
                                    endDate:1505636847000,
                                    deliverDate:"123",
                                    productionDays:"123",
                                    surplusDays:"123",
                                    quantity:"123",
                                    cutCount:"123",
                                    complete:"123",
                                    ratio:"123",
                                };
                                 * */

                                this.setState({
                                    tableData:[data],
                                    d_start:Util.dateFormat(data.startDate),
                                    d_end:Util.dateFormat(data.endDate),
                                });
                                cb && cb(data);
                                break;
                            case "psChart"://图标数据
                                let jsonData = response.productionScheduleServer.responseData.jsonData;
                                const planAverageCount = response.productionScheduleServer.responseData.planAverageCount ;
                                const delayDays = response.productionScheduleServer.responseData.delayDays;
                                const max = response.productionScheduleServer.responseData.max;
                                this.MAX_TOTAL_COUNT = max;
                                this.planAverageCount = planAverageCount;
                                jsonData = JSON.parse(jsonData);

                                /**
                                 * 假数据
                                 * jsonData = {
                                    "2017-07-11":{
                                        "iscomplete":"0",
                                        "itemList":[
                                            {"count":"10","iscomplete":"0","name":"3组"}
                                        ],
                                        "totalCount":"10"
                                    },
                                    "2017-07-15":{
                                        "iscomplete":"0",
                                        "itemList":[
                                            {"count":"100","iscomplete":"0","name":"3组"}
                                        ],
                                        "totalCount":"100"
                                    },
                                };
                                 * */
                                this.setState({
                                    data:jsonData,
                                    delayDays:delayDays,
                                    spinning:false,
                                });
                                cb && cb(inParam.startDate,inParam.endDate);
                                break;
                        }
                    }else {
                        if (errorCode == 500){
                            message.error('服务器错误,请联系系统管理员');
                        }else {
                            message.error(value)
                        }
                    }
                }
            }
        )
    };

    TableDataFormatting = (data)=>{
        // console.log(data);
        this.httpRequest({
            action : "psChart",
            psId:data.psId,
            startDate:data.startDate,
            endDate:data.endDate,
        },this.DatePickerChange);
    };
    // 日期change更改事件
    DatePickerChange = (d_start,d_end)=>{
        /**
         * 前后各增加15天，如延期超过向后增加的15天，则延期几天，在延期的基础上再多增加一天
         * */
        let {delayDays} = this.state;
        let d = new Date(d_start-(86400000*15));//图表开始时间
        if(delayDays>=15){
            d_end = new Date(d_end+(86400000*delayDays));
        }else {
            d_end = new Date(d_end+(86400000*15));//图表结束时间
        }
        let dateArr = [];

        // 更新时间数组取出90天中的时间列表
        while(1) {
            if (d.valueOf() > d_end.valueOf()) { break;}

            dateArr.push(Util.dateFormat(d));  // dateArr :: ["2017-05-05","2017-05-06"......]

            d.setDate(d.getDate() + 1);  //  自增1天
        }
        //console.log(dateArr);
        this.setState({
            dateArr, //本地时间队列
        });
    };

    render() {
        const {tableData,data,canvasWidth,dateArr,delayDays,d_start,d_end} = this.state;
        // console.log(data);
        return(
            <div className="Yyd-chart-box">
                <Logic_Table
                    dataSource={tableData}
                />
                <div className="Yyd-chart-schedule">
                    <Logic_Chart
                        data={data}
                        canvasWidth={canvasWidth?canvasWidth:""}
                        dateArr={dateArr?dateArr:[]}
                        MAX_TOTAL_COUNT={this.MAX_TOTAL_COUNT}
                        planAverageCount={this.planAverageCount}
                        d_start={d_start}
                        d_end={d_end}
                    />
                </div>
                {
                    delayDays>=0 ?(
                        <p className="production_scheduling_schedule_delayDays">
                            <i className="production_scheduling_schedule_delayDays_i"></i>
                            预计延期{delayDays}天
                        </p>
                    ):(
                        <p className="production_scheduling_schedule_delayDays">
                            <i className="production_scheduling_schedule_delayDays_i"></i>
                            预计提前{-delayDays}天
                        </p>
                    )
                }
                <Spin
                    spinning={this.state.spinning}
                    wrapperClassName="Yyd-chart-box"
                    className="production_facResource_spinning"
                    size="large"
                    tip="拼命加载中，请稍后！"
                />
            </div>
        )
    }
}